<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
	<script type="text/javascript">
		// function add(a,b) {
		// 	return a+b;
		// }
		// console.log(add(30,20))


		// 2,默认的表达式也可以是一个函数
		// function add(a,b=getVal(5)){
		// 	return a+b;
		// }
		// function getVal(val){
		// 	return val+5;
		// }
		// console.log(add(5))

		// 3
		// es5的写法
		// function pick(obj){
		// 	let result = Object.create(null);
		// 	for(let i=1;i<arguments.length;i++){
		// 		result[arguments[i]]=obj[arguments[i]]
		// 	}
		// 	return result;
		// }
		// let book={
		// 	title:"es6的教程",
		// 	author:"小胖子",
		// 	year:2019
		// }
		// let bookData = pick(book,'title','year','author');
		// console.log(bookData);

		// 剩余参数：由三个点...和一个紧跟着的具名参数指定...keys
		// function pick(obj,...keys){
		// 	// keys,解决了arguments的问题
		// 	let result = Object.create(null);
		// 	for (let i=0;i<keys.length;i++){
		// 		result[keys[i]]=obj[keys[i]];
		// 	}
		// 	return result;
		// }
		// let book={
		// 	title:"es6的教程",
		// 	author:"小胖子",
		// 	year:2019
		// }

		// let bookData=pick(book,'year','author');
		// console.log(bookData);


		// 4、拓展运算符
		// 剩余运算符把多个独立的合并到一个数组中
		// 扩展运算法：将一个数组分割并将各个项作为分离的参数传给函数

		// 取最大值
		// es5第一种方法
		// const maxNum = Math.max(20,30);
		// console.log(maxNum);


		// es5第二种方法
		// 处理数组中的最大值，使用apply
		// const arr = [10,20,50,90,68];
		// console.log(Math.max.apply(null,arr));


		// es6拓展运算法
		// const arr = [10,20,50,90,68];
		// console.log(Math.max(...arr));


		// es6的箭头函数
		// 使用=》来定义  function(){}等于()=>{}
		// 如果有两个参数
		// let add=function(a,b){
		// 	return a+b;
		// }
		// console.log(add(10,20))
		// // 简洁写法
		// let add=(a,b)=>{
		// 	return a+b;
		// }
		// console.log(add(10,4))




		// 如果只有一个参数
		// let add=val =>{
		// 	return val+5;
		// }
		// console.log(add(10));


		// 有return返回值还可以更简洁，直接返回val
		// let add = val =>(val+6);
		// console.log(add(10))


		// 如果仅仅返回的是形参
		// let add=val=>val;
		// console.log(add(5))


		// 如果有两个值
		// let add=(val1,val2)=>(val1+val2);
		// console.log(add(10,33))



		// 如果没有参数
		// 如果没有参数小括号一定要保留
		// let fn=()=>'hello world'+123;
		// console.log(fn());


		// 例子
		// let getObj=id=>{
		// 	return{
		// 		id:id,
		// 		name:'小太阳'
		// 	}
		// }
		// let obj = getObj(1);
		// console.log(obj);
		// 简洁写法
		// let getObj=id=>({id:id,name:"小胖子"})
		// let obj=getObj(1);
		// console.log(obj);



		// 闭包函数
		// let fn=(function(){
		// 	return function(){
		// 		console.log("hello es6")
		// 	}
		// })();
		// fn();


		// 箭头函数表示
		// let fn=(()=>{
		// 	return()=>{
		// 		console.log("hello 小胖")
		// 	}
		// })();
		// fn();



		  // es6中没有this绑定
		  // es5中this指向：取决于调用函数的上下文对象
		  // es5例子
		  // let PageHandle={
		  // 	id:123,
		  // 	init:function(){
		  // 		document.addEventListener('click',function(event){
		  // 			this.doSomeThings(event.type);
		  // 		}.bind(this),false)
		  // 	},
		  // 	doSomeThings:function(type){
		  // 		console.log(`事件类型：${type},当前id:${this.id}`);
		  // 	}
		  // }
		  // PageHandle.init();


		  // es6箭头函数的写法
		  //  let PageHandle={
		  // 	id:123,
		  // 	init:function(){
		  // 		// 箭头函数没有this指向，箭头函数内部this只能通过查找作用域链来确定，一旦使用箭头函数，当前就不存在作用域链
		  // 		document.addEventListener('click',(event)=>{
		  // 			this.doSomeThings(event.type);
		  // 		},false)
		  // 	},
		  // 	doSomeThings:function(type){
		  // 		console.log(`事件类型：${type},当前id:${this.id}`);
		  // 	}
		  // }
		  // PageHandle.init();



		  // 使用箭头函数的注意事项：
		  // 1、使用箭头函数，函数的内部没有arguments

		  // let getVal = (a,b)=>{
		  // 	// console.log(arguments);    //此处会报错，获取不到arguments
		  // 	return a+b;
		  // }
		  // console.log(getVal(1,3));

		  

		  // 2、箭头函数不能使用new关键字来实例化对象
		 	// function函数也是一个对象，但是箭头函数不是一个对象，它其实是一个函数的语法糖
		  // let Person=()=>{

		  // };
		  // let p=new Person();   //会报错说语法里没有constructor属性

</script>
</body>
</html>